<template>
	<view>
		<view class="uni-padding-wrap">
			<uni-section title="基本用法" type="line">
				<view class="example">
					<!-- 基础用法，不包含校验规则 -->
					<uni-forms ref="valiForm" :rules="rules" :model="valiFormData" labelWidth="80px">
						<uni-forms-item required label="入职时间" name="rzsj">
							<uni-datetime-picker type="date" return-type="timestamp"
								v-model="valiFormData.rzsj" />
						</uni-forms-item>
						<uni-forms-item label="部门" required name="bm">
							<uni-data-picker v-model="valiFormData.bm" :localdata="bms" popup-title="选择部门">
							</uni-data-picker>
						</uni-forms-item>
						<uni-forms-item label="岗位" required name="gw">
							<uni-easyinput v-model="valiFormData.gw" placeholder="请输入岗位" />
						</uni-forms-item>
						<uni-forms-item label="工号" required name="gh">
							<uni-easyinput v-model="valiFormData.gh" placeholder="请输入工号" />
						</uni-forms-item>
						<uni-forms-item label="姓名" required name="xmyxsxm">
							<uni-easyinput v-model="valiFormData.xmyxsxm" placeholder="请输入姓名" />
						</uni-forms-item>
						<uni-forms-item label="性别" required name="xb">
							<uni-data-checkbox v-model="valiFormData.xb" :localdata="sexs" />
						</uni-forms-item>
						<uni-forms-item label="手机号" required name="xmtxszh">
							<uni-easyinput v-model="valiFormData.xmtxszh" placeholder="请输入手机号" />
						</uni-forms-item>
						<uni-forms-item label="身份证" required name="sfz">
							<uni-easyinput type="idcard" v-model="valiFormData.sfz" placeholder="请输入身份证" />
						</uni-forms-item>
						<uni-forms-item label="身份证正反面">
							<uni-file-picker
								ref="files"
								:sizeType="['compressed']"
								v-model="valiFormData.sfzimg"  
								file-mediatype="image"
								:image-styles="imageStyles"
								mode="grid"
								file-extname="png,jpg,webp,bmp"
								:limit="2"
							/>
						</uni-forms-item> 
						<uni-forms-item label="学历学位证书">
							<uni-file-picker
								ref="files"
								:sizeType="['compressed']"
								v-model="valiFormData.xlxwimg"  
								file-mediatype="image"
								:image-styles="imageStyles"
								mode="grid"
								file-extname="png,jpg,webp,bmp"
								:limit="9"
							/>
						</uni-forms-item> 
<!-- 						<uni-forms-item label="职称或教学资格证书">
							<uni-file-picker
								ref="files"
								:sizeType="['compressed']"
								v-model="valiFormData.zcjximg"  
								file-mediatype="image"
								:image-styles="imageStyles"
								mode="grid"
								file-extname="png,jpg,webp,bmp"
								:limit="9"
							/>
						</uni-forms-item> 
						<uni-forms-item label="相关技能登记证书">
							<uni-file-picker
								ref="files"
								:sizeType="['compressed']"
								v-model="valiFormData.xgdjimg"  
								file-mediatype="image"
								:image-styles="imageStyles"
								mode="grid"
								file-extname="png,jpg,webp,bmp"
								:limit="9"
							/>
						</uni-forms-item> -->
						<button type="primary" @click="submit('valiForm')">提交</button>
					</uni-forms>
				</view>
			</uni-section>
		</view>
	</view>
</template>


<script>
	var _this;
	var vk = uni.vk;
	import uniForms from "@/pages_modules/components/uni-forms/uni-forms";
	import uniFormsItem from "@/pages_modules/components/uni-forms-item/uni-forms-item";
	import uniDataCheckbox from "@/pages_modules/components/uni-data-checkbox/uni-data-checkbox";
	import uniDatetimePicker from "@/pages_modules/components/uni-datetime-picker/uni-datetime-picker";
	import uniDataPicker from "@/pages_modules/components/uni-data-picker/uni-data-picker";
	import uniFilePicker from "@/pages_modules/components/uni-file-picker/uni-file-picker";
	export default {
		components:{uniForms,uniFormsItem,uniDataCheckbox,uniDatetimePicker,uniDataPicker,uniFilePicker},
		data() {
			return {
				// 校验表单数据
				// valiFormData: {
				// 	name: ''
				// },
				options:{},
				valiFormData: {
					userid:vk.getVuex('$user.userInfo._id'),
					gw: '',
					xmyxsxm: '',
					dh: '',
					sfz: '',
					jrzt:'3',
					avatar:vk.getVuex('$user.userInfo.avatar'),
					nickname:vk.getVuex('$user.userInfo.nickname'),
					xmtxszh:vk.getVuex('$user.userInfo.mobile'),
					opid:vk.getVuex('$user.userInfo.wx_openid.mp-weixin'),
					bm:'',
					xb: '男',
					rzsj: Date.now(),
					sfzimg:[],
					xlxwimg:[],
					zcjximg:[],
					xgdjimg:[],
				},
				imageStyles:{
					border:{
						color:"#2F4056"
					}
				},
				bms: [
					{ value: '院部', text: "院部" },
					{ value: '党政办', text: "党政办" },
					{ value: '财务处', text: "财务处" },
					{ value: '安保处', text: "安保处" },
					{ value: '招生办', text: "招生办" },
					{ value: '继续教育学院', text: "继续教育学院" },
					{ value: '学生处', text: "学生处" },
					{ value: '教务处', text: "教务处" },
					{ value: '后勤处', text: "后勤处" },
					{ value: '工学院', text: "工学院" },
					{ value: '商学院', text: "商学院" },
					{ value: '医护学院', text: "医护学院" },
					{ value: '信息学院', text: "信息学院" },
					{ value: '中职部', text: "中职部" }
				],
				// 单选数据源
				sexs: [{
					text: '男',
					value: '男'
				}, {
					text: '女',
					value: '女'
				}],
				rules: {
					name: {
						rules: [{
							required: true,
							errorMessage: '姓名不能为空'
						}]
					},
					rzsj: {
						rules: [{
							required: true,
							errorMessage: '不能为空'
						}]
					},
					gh: {
						rules: [{
							required: true,
							errorMessage: '不能为空'
						}]
					},
					sfz: {
						rules: [{
							required: true,
							errorMessage: '不能为空'
						}]
					},
					xmtxszh: {
						rules: [{
							required: true,
							errorMessage: '不能为空'
						}]
					},
					bm: {
						rules: [{
							required: true,
							errorMessage: '不能为空'
						}]
					},
					xmyxsxm: {
						rules: [{
							required: true,
							errorMessage: '不能为空'
						}]
					},
					gw: {
						rules: [{
							required: true,
							errorMessage: '不能为空'
						}]
					}
				},
			}
		},
		//销毁之前
		beforeDestroy() {
			
		},
		// 监听 - 页面每次【加载时】执行(如：前进) await
		async onLoad(options = {}) {
			_this = this;
			vk = uni.vk;
			this.options = options;
			//获取用户信息
			// let userinfo = vk.getVuex('$user.userInfo');
			// console.log(userinfo)
		},
		// 监听 - 页面【首次渲染完成时】执行。注意如果渲染速度快，会在页面进入动画完成前触发
		onReady(){
			this.$refs.valiForm.setRules(this.rules)
		},
		// 监听 - 页面每次【显示时】执行(如：前进和返回) (页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面)
		onShow() {
			
		},
		// 监听 - 页面每次【隐藏时】执行(如：返回)
		onHide() {
			
		},
		// 监听 - 点击右上角转发时
		onShareAppMessage(options) {
			
		},
		// 函数
		methods: {
			async upload11(){
				let sfzimgjson = []
				if(_this.valiFormData.sfzimg.length){
					_this.valiFormData.sfzimg.forEach(item =>{
						delete item.extname
						delete item.fileType
						delete item.image
						delete item.fileID
						delete item.name
						delete item.size
						delete item.path
						delete item.uuid
						delete item.status
						delete item.cloudPath
					})
					for (let obj of _this.valiFormData.sfzimg) {
					    let values = Object.values(obj);  
					    for (let value of values) {  
							sfzimgjson.push(value)
					    }  
					}
				}
				let xlxwimgjson = []
				if(_this.valiFormData.xlxwimg.length){
					_this.valiFormData.xlxwimg.forEach(item =>{
						delete item.extname
						delete item.fileType
						delete item.image
						delete item.fileID
						delete item.name
						delete item.size
						delete item.path
						delete item.uuid
						delete item.status
						delete item.cloudPath
					})
					for (let obj of _this.valiFormData.xlxwimg) {
					    let values = Object.values(obj);  
					    for (let value of values) {  
							xlxwimgjson.push(value)
					    }  
					}
				}
				let zcjximgjson = []
				if(_this.valiFormData.zcjximg.length){
					_this.valiFormData.zcjximg.forEach(item =>{
						delete item.extname
						delete item.fileType
						delete item.image
						delete item.fileID
						delete item.name
						delete item.size
						delete item.path
						delete item.uuid
						delete item.status
						delete item.cloudPath
					})
					for (let obj of _this.valiFormData.zcjximg) {
					    let values = Object.values(obj);  
					    for (let value of values) {  
							zcjximgjson.push(value)
					    }  
					}
				}
				let xgdjimgjson = []
				if(_this.valiFormData.xgdjimg.length){
					_this.valiFormData.xgdjimg.forEach(item =>{
						delete item.extname
						delete item.fileType
						delete item.image
						delete item.fileID
						delete item.name
						delete item.size
						delete item.path
						delete item.uuid
						delete item.status
						delete item.cloudPath
					})
					for (let obj of _this.valiFormData.xgdjimg) {  
					    let values = Object.values(obj);  
					    for (let value of values) {  
							xgdjimgjson.push(value)
					    }  
					}

				}
				_this.valiFormData.sfzimg = sfzimgjson
				_this.valiFormData.xlxwimg = xlxwimgjson
				_this.valiFormData.zcjximg = zcjximgjson
				_this.valiFormData.xgdjimg = xgdjimgjson
				await vk.callFunction({
				  url: 'client/jp/pub/jpapi.addyghmc',
				  title:'请求中...',
				  data:{..._this.valiFormData}
				}).then((data) => {

					if(data.userinfo){
						uni.showToast({title: `操作成功`})
					}else{
						vk.toast("先让人事创花名册", "none", 5000); 
					}

				_this.valiFormData = {
						gw: '',
						xm: '',
						gh: '',
						sfz: '',
						xmtxszh:'',
						bm:'',
						xb: '男',
						rzsj: Date.now(),
						sfzimg:[]
						// xlxwimg:[],
						// zcjximg:[],
						// xgdjimg:[]
					}
				}).catch((err) => {});
			},
			// 页面数据初始化函数
			submit(ref) {
				this.$refs[ref].validate().then(res => {

					vk.pubfn.debounce(() => {
					  // 这里写你自己的逻辑
					  this.upload11()
					}, 3000);
					
				}).catch(err => {
					console.log('err', err);
				})
			},
		},
		// 监听器
		watch:{
			
		},
		// 计算属性
		computed:{
			
		}
	}
</script>
<style lang="scss" scoped>
	.example {
		padding: 15px;
		background-color: #fff;
	}
	
</style>